<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
  <button id="btn">排序</button>
  <table border="1" style="border-collapse: collapse" width="500">
      <thead>
          <th>名字</th>
          <th>年龄</th>
      </thead>
      <tbody>
          <tr>
              <td>A</td>
              <td>12</td>
          </tr>
          <tr>
              <td>B</td>
              <td>25</td>
          </tr>
          <tr>
              <td>C</td>
              <td>1</td>
          </tr>
          <tr>
              <td>D</td>
              <td>87</td>
          </tr>
          <tr>
              <td>E</td>
              <td>17</td>
          </tr>
          <tr>
              <td>F</td>
              <td>7</td>
          </tr>
          <tr>
              <td>G</td>
              <td>22</td>
          </tr>


      </tbody>
  </table>
  <script>
      var btn = document.getElementById('btn');
      var oTable = document.getElementsByTagName('table')[0];
      var aRows = oTable.tBodies[0].rows;
      var arr=[];

      btn.onclick = function () {
         for(var i=0;i<aRows.length;i++){
             arr[i] = aRows[i];
         }
         arr.sort(function (a1,a2) {
          var n1 = a1.cells[1].innerHTML;
          var n2 = a2.cells[1].innerHTML;
            return n1-n2;
         });

          for(var i = 0;i<arr.length;i++){
              oTable.appendChild(arr[i]);
          }

      }

  </script>

</body>
</html>